<script setup>
import FormatLayout from '@/components/formatLayout/formatLayout.vue';
import { ref } from 'vue';

const leftContent = ref(''); // 左侧的输入信息
const rightContent = ref(''); // 右侧的转换信息
</script>

<template>
  <FormatLayout title="参考文献格式排版">
    <div class="reference-style-select-box">
      <div class="prefix">引用文献</div>
      <div class="type-select common-select">
        <el-select></el-select>
      </div>
      <div class="style-select common-select">
        <el-select></el-select>
      </div>
    </div>
    <div class="reference-change-box">
      <div class="left-box input-box">
        <el-input
          type="textarea"
          v-model="leftContent"
          placeholder="在此输入或粘贴参考文献，不同参考文献之间请用回车换行，同一条参考文献中避免使用回车"
        />
      </div>
      <div class="change-icon">
        <img src="@/assets/images/formatPaper/arrow-right.png" alt="" />
      </div>
      <div class="right-box input-box">
        <el-input type="textarea" v-model="rightContent" />
      </div>
    </div>
    <div class="create-btn">立即生成</div>
  </FormatLayout>
</template>

<style scoped lang="less">
@import '@/views/formatPaper/formatPaper.less';
@import './formatReference.less';
</style>
